<template>
	<!-- 法律政策 -->
	<view class="legal-policy-view">
		<view class="header-view">
			<up-image src="https://axhub.im/ax9/4fb01a9c2a1b02c8/images/%E6%B3%95%E5%BE%8B%E6%94%BF%E7%AD%96/u9.png" width="68rpx" height="68rpx" mode="scaleToFill"></up-image>
			<view class="header-title">工会法律政策</view>
		</view>
		<view class="policy-list">
			<view class="news-item" v-for="index in 10" :key="index">
				<view class="news-info">
					<view class="news-title">进一步全面深化改革要讲求方式方法论学习贯彻习近平总书记在企业和专家座谈会上重要讲话进一步全面深化改革要讲求方式方法论学习贯彻习近平总书记在企业和专家座谈会上重要讲话</view>
					
					<view class="bottom-info">
						<view class="count">
							<up-icon name="eye" size="20"></up-icon>
							<view>1000</view>
						</view>
						<view class="org">
							<view>2025.03.20 14:30</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import publicityList from '@/components/publicity-list.vue'
	export default {
		components: {
			publicityList
		},
	}
</script>

<style lang="scss" scoped>
	.legal-policy-view {
		background-color: #E4E4E4;
		.header-view {
			width: 100%;
			height: 147px;
			background: url('https://axhub.im/ax9/4fb01a9c2a1b02c8/images/%E6%B3%95%E5%BE%8B%E6%94%BF%E7%AD%96/u7.png') no-repeat;
			display: flex;
			justify-content: center;
			align-items: center;
			.header-title {
				font-size: 34px;
				font-weight: 700;
				color: #ffffff;
				margin-left: 10px;
			}
		}
		.policy-list {
			padding: 30rpx;
			.news-item {
				background-color: rgba(242, 242, 242, 1);
				border-radius: 15px;
				padding: 30rpx;
				margin-bottom: 30rpx;
				.news-info {
					height: 160rpx;
					flex: 1;
					display: flex;
					flex-direction: column;
					justify-content: space-between;
					padding-left: 10rpx;
					
					.news-title {
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
						overflow: hidden;
						text-overflow: ellipsis;
					}
					
					.bottom-info {
						display: flex;
						justify-content: space-between;
						align-items: center;
						font-size: 26rpx;
						color: $uni-text-color-grey;
						
						.org, .count {
							display: flex;
							align-items: center;
						}
						
						:deep(.u-iconfont) {
							color: $uni-text-color-grey !important;
						}
					}
				} 
			}
		}
	}
	
</style>